<template>
  <div class="app-container">
    <p style="font: 20px Extra large">医院{{btnName}}列表</p>
    <el-form label-width="120px">
      <el-form-item label="医院名称">
        <el-input v-model="hospitalSet.hosname" />
      </el-form-item>
      <el-form-item label="医院编号">
        <el-input v-model="hospitalSet.hoscode" />
      </el-form-item>
      <el-form-item label="api基础路径">
        <el-input v-model="hospitalSet.apiUrl" />
      </el-form-item>
      <el-form-item label="联系人姓名">
        <el-input v-model="hospitalSet.contactsName" />
      </el-form-item>
      <el-form-item label="联系人手机">
        <el-input v-model="hospitalSet.contactsPhone" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="saveOrUpdate">{{btnName}}</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import hospset from "@/api/hospset";
export default {
  data() {
    return {
      hospitalSet: {},
      btnName:'fs'
    };
  },
  //在页面渲染前执行
  created() {
    //若未定义返回false
    if (this.$route.params && this.$route.params.id) {
      //有参数则调用接口获取信息
      this.btnName='修改'
      this.getHospSetById(this.$route.params.id);
    }else{
      this.btnName='添加'
    }
  },
  methods: {
    //一、根据路由是否有参数进行函数调用
    saveOrUpdate() {
      if (this.hospitalSet.id) {
        //有参数则为修改的路由跳转
        this.updateHospSet();
      }else{
        this.saveHospSet();
      }
    },
    //二、根据id获取医院设置信息
    getHospSetById(id) {
      hospset
        .getHospSetById(id)
        .then((response) => {
          //给其双向绑定的对象赋值
          this.hospitalSet = response.data;
        })
        .catch((error) => {
          console.log(error);
        });
    },
    //三、添加医院设置信息操作
    saveHospSet() {
      //注意当前的医院设置列表是双向绑定，通过this来获取
      hospset
        .saveHospitalSet(this.hospitalSet)
        .then((response) => {
          //提示添加成功
          this.$message({
            type: "success",
            message: "添加成功!",
          });
          //路由跳转到设置列表显示页面
          this.$router.push({ path: "/hospset/list" });
        })
        .catch((error) => {
          console.log(error);
        });
    },
    //四、医院设置信息修改
    updateHospSet(){
      alert("fsf")
      hospset.updateHosp(this.hospitalSet)
      .then(response=>{
        //提示修改成功
          this.$message({
            type: "success",
            message: "修改成功!",
          });
      }).catch(error=>{
        console.log(error)
      })
    }
  },
};
</script>
